<template>
	<el-dialog width="50%" title="修改订单数据" :visible.sync="dialogVisible" :close-on-click-modal="false">
		<el-form class="ruleForm" :model="form" label-width="100px">
			<el-form-item v-if="form.num == 2" label="租赁方式" prop="pact_type">
				<el-radio-group v-model="form.pact_type">
					<el-radio v-for="(val, key) in initData.pact_type" :key="key" :label="key">{{ val }}</el-radio>
				</el-radio-group>
				<p class="type_tip">
					<template v-if="form.pact_type == 1">
						<span>固定租期的可扣款金额=商品套餐押金+总租金</span><br>商品设置固定租期后，承租人须待租赁期满后才能退还租赁物。固定租期无法使用花呗分期功能。
					</template>
					<template v-if="form.pact_type == 2">
						<span>租完即送的可扣款金额=总租金</span><br>商品设置租完即送后，租赁期内承租人不得单方面解除协议提前退还租赁物，承租人须按订单约定按期支付租金。租完即送可使用花呗分期功能。
					</template>
				</p>
			</el-form-item>
			<el-form-item v-if="form.num == 2 && form.pact_type == 1" label="每期租金">
				<el-input v-model="form.rent" clearable placeholder="请输入每期租金" />
			</el-form-item>
			<el-form-item v-if="form.num == 2" label="市场价" prop="setmeal_foregift">
				<el-input v-model="form.setmeal_foregift" clearable placeholder="请输入市场价" />
				<p class="type_tip">
					<span>市场价=订单总价值(总租金+买断金)，非必要情况下请勿增加市场价金额，否则会导致代扣金额超出预授权金额造成部分租金/买断金代扣失败。</span>
				</p>
			</el-form-item>
			<el-form-item v-if="form.num == 2" label="租期" prop="month_total">
				<el-radio-group v-model="form.month_total">
					<el-radio v-for="(val, key) in initData.month_total" :key="key" :label="key">{{ val }}</el-radio>
				</el-radio-group>
			</el-form-item>
			<el-form-item v-if="form.num == 2" label="碎屏险活动">
				<el-radio-group v-model="form.is_insurance_choose">
					<el-radio v-for="(val, key) in insurance_list" :key="key" :label="key">{{ val }}</el-radio>
				</el-radio-group>
			</el-form-item>
		</el-form>
		<div slot="footer" class="dialog-footer">
			<el-button size="small" @click="dialogVisible = false">取 消</el-button>
			<el-button size="small" type="primary" @click="save">确 定</el-button>
		</div>
	</el-dialog>
</template>
<script>
	import {
		editOrderData,
		getOrderData,
		getLeaseRent
	} from '@/api/order'
	export default {
		props: {
			editItem: {
				type: Object,
				default: () => ({})
			}
		},
		data() {
			return {
				form: {
					pact_type: '',
					orderId: '',
					shopname: '',
					seller_id: '', // 供应商商户ID
					num: '',
					rent:'',
					setmeal_foregift:'', 
					month_total:'',
					is_insurance_choose:''
				},
				initData: {
					pact_type: [], // 租赁方式
					month_total: [],//租期
					setmeal_price: '', // 买断金
					shopname: '', // 供应商
					rent: '',// 每期租金
					setmeal_foregift: '', //市场价
					month_total:'',
					is_insurance_choose:''
				},
				shopname_data: [], // 供应商列表
				insurance_list:[],
				dialogVisible: false
			}
		},
		watch: {
			dialogVisible(val) {
				if (val) {
					this.init()
					this.getData()
				}
			}
		},
		methods: {
			getData() {
				this.initData.shopname = this.form.shopname
				getLeaseRent(this.form.orderId).then(res => {
					this.form.rent = res.rent
				})
				getOrderData(this.form.orderId).then(res => {
					this.initData.pact_type = res.pact_type
					this.initData.month_total = res.month_total
					this.insurance_list = res.insurance_list
				})
			},
			init() {
				for (const key in this.form) {
					this.form[key] = this.editItem[key].toString() || ''
				}
			},
			changeSellerId(item) {
				this.form.seller_id = item
			},
			save() {
				const that = this
				this.$confirm('确定修改？', '修改供应商', {
					confirmButtonText: '确定',
					cancelButtonText: '取消'
				}).then(() => {
					const data = {
						...that.form
					}
					editOrderData(data).then(res => {
						this.dialogVisible = false
						this.$emit('getList', true)
					})
				}).catch(() => {})
			}
		}
	}
</script>

<style lang="scss" scoped>
	.type_tip {
		color: #999999;
		line-height: 22px;

		span {
			color: #ff4146;
		}
	}
</style>
